<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
	  xmlns:h="http://java.sun.com/jsf/html"
      xmlns:f="http://java.sun.com/jsf/core"
      xmlns:p="http://primefaces.org/ui">
<h:head>
    <title>Instituto Missionário de Ensino El Shaday</title>
</h:head>
<h:body style="font-size: 14px;">
	<div id="geral">
		<h:form id="formCadastro">
			<p:growl id="messages" showDetail="false" />
			<p:panel header="Cadastro de Aluno" style="margin:5px; width: auto;">
				<p:panelGrid>
					<p:row>
						<p:column>
							<p:outputLabel for="matricula" value="Matricula: " />
						</p:column>
						<p:column colspan="4">
							<p:inputText id="matricula" size="30"
								value="#{alunoBean.aluno.matricula}" />
						</p:column>
						<p:column rowspan="5" colspan="2">
							<div align="center" id="foto">
								<p:graphicImage value="#{alunoBean.fotoPrincipal}" width="180"
									height="188" rendered="#{alunoBean.fotoPrincipal != null}" />
								<p:graphicImage value="/images/avatar_padrao.jpg" width="180"
									height="188" rendered="#{alunoBean.fotoPrincipal == null}" />
							</div>
						</p:column>
					</p:row>
					
					<p:row>
						<p:column>
							<p:outputLabel for="nome" value="Nome: " />
						</p:column>
						<p:column colspan="4">
							<p:inputText id="nome" size="90" value="#{alunoBean.aluno.nome}" />
						</p:column>
					</p:row>

					<p:row>
						<p:column colspan="5" styleClass="ui-widget-header">Filiação:</p:column>
					</p:row>

					<p:row>
						<p:column>
							<p:outputLabel for="filicao-pai" value="Pai: " />
						</p:column>
						<p:column colspan="4">
							<p:inputText id="filicao-pai" size="90"
								value="#{alunoBean.aluno.pai}" />
						</p:column>
					</p:row>
					<p:row>
						<p:column>
							<p:outputLabel for="filicao-mae" value="Mãe: " />
						</p:column>
						<p:column colspan="4">
							<p:inputText id="filicao-mae" size="90"
								value="#{alunoBean.aluno.mae}" />
						</p:column>
					</p:row>

					<p:row>
						<p:column>
							<p:outputLabel for="dt-nascimento" value="Data de Nascimento: " />
						</p:column>
						<p:column>
							<p:calendar id="dt-nascimento" navigator="true" display="inline"
								showOn="button" pattern="dd/MM/yyyy" placeholder="dd/mm/yyyy"
								yearRange="c-90:c" value="#{alunoBean.aluno.dataNascimento}" />
						</p:column>
						<p:column>
							<p:outputLabel for="local-nasc" value="Local: " />
						</p:column>
						<p:column colspan="2">
							<p:inputText id="local-nasc" size="25"
								value="#{alunoBean.aluno.local}" />
						</p:column>

						<p:column rowspan="2" colspan="2">
							<div align="center">
								<p:commandButton id="modalUploadFoto" value="Upload Foto"
									icon="ui-icon-circle-arrow-n"
									onclick="dialogUploadFoto.show();" />
							</div>
						</p:column>
					</p:row>

					<p:row>
						<p:column colspan="5" styleClass="ui-widget-header">  
			            Documentação: 
			        </p:column>
					</p:row>

					<p:row>
						<p:column>
							<p:outputLabel for="rg" value="RG: " />
						</p:column>
						<p:column>
							<p:inputText id="rg" size="25" value="#{alunoBean.aluno.rg}" />
						</p:column>
						<p:column>
							<p:outputLabel for="orgao" value="Órgão: " />
						</p:column>
						<p:column colspan="3">
							<p:inputText id="orgao" size="25"
								value="#{alunoBean.aluno.orgao}" />
						</p:column>
					</p:row>
					<p:row>
						<p:column>
							<p:outputLabel for="dt-expedicao" value="Expedida em: " />
						</p:column>
						<p:column>
							<p:calendar id="dt-expedicao" navigator="true" display="inline"
								showOn="button" pattern="dd/MM/yyyy" placeholder="dd/mm/yyyy"
								yearRange="c-30:c" value="#{alunoBean.aluno.rgExpedida}" />
						</p:column>
						<p:column>
							<p:outputLabel for="cpf" value="CPF: " />
						</p:column>
						<p:column colspan="3">
							<p:inputMask id="cpf" mask="999.999.999-99" size="25"
								value="#{alunoBean.aluno.cpf}" />
						</p:column>
					</p:row>

					<p:row>
						<p:column colspan="6" styleClass="ui-widget-header">
							<p:spacer height="0" />
						</p:column>
					</p:row>

					<p:row>
						<p:column>
							<p:outputLabel for="endereco" value="Endereço: " />
						</p:column>
						<p:column colspan="5">
							<p:inputText id="endereco" size="78"
								value="#{alunoBean.aluno.endereco}" />
						</p:column>
					</p:row>
					<p:row>
						<p:column>
							<p:outputLabel for="bairro" value="Bairro: " />
						</p:column>
						<p:column>
							<p:inputText id="bairro" size="25"
								value="#{alunoBean.aluno.bairro}" />
						</p:column>
						<p:column>
							<p:outputLabel for="cidade" value="Cidade: " />
						</p:column>
						<p:column>
							<p:inputText id="cidade" size="25"
								value="#{alunoBean.aluno.cidade}" />
						</p:column>
						<p:column>
							<p:outputLabel for="cep" value="CEP: " />
						</p:column>
						<p:column>
							<p:inputMask id="cep" mask="99999-999" size="20"
								value="#{alunoBean.aluno.cep}" />
						</p:column>
					</p:row>
					<p:row>
						<p:column>
							<p:outputLabel for="email" value="Email: " />
						</p:column>
						<p:column colspan="3">
							<p:inputText id="email" size="70"
								value="#{alunoBean.aluno.email}" />
						</p:column>
						<p:column>
							<p:outputLabel for="estado-civil" value="Estado Civil: " />
						</p:column>
						<p:column>
							<p:selectOneMenu id="estado-civil"
								value="#{alunoBean.aluno.estadoCivil}">
								<f:selectItem itemLabel="Selecione" itemValue="" />
								<f:selectItem itemLabel="Casado" itemValue="casado" />
								<f:selectItem itemLabel="Divorciado" itemValue="divorciado" />
								<f:selectItem itemLabel="Solteiro" itemValue="solteiro" />
								<f:selectItem itemLabel="Separado" itemValue="separado" />
								<f:selectItem itemLabel="Viúvo" itemValue="viuvo" />
								<f:selectItem itemLabel="Outros" itemValue="outros" />
							</p:selectOneMenu>
						</p:column>
					</p:row>

					<p:row>
						<p:column>
							<p:outputLabel for="tel-res" value="Tel.Res: " />
						</p:column>
						<p:column>
							<p:inputMask id="tel-res" mask="(99) 9999-9999" size="25"
								placeholder="(xx) xxxx-xxxx"
								value="#{alunoBean.aluno.telResidencial}" />
						</p:column>
						<p:column>
							<p:outputLabel for="tel-cel" value="Tel.Cel: " />
						</p:column>
						<p:column>
							<p:inputMask id="tel-cel" mask="(99) 9999-9999" size="25"
								placeholder="(xx) xxxx-xxxx"
								value="#{alunoBean.aluno.telCelular}" />
						</p:column>
						<p:column>
							<p:outputLabel for="radio" value="Radio: " />
						</p:column>
						<p:column>
							<p:inputText id="radio" size="25"
								value="#{alunoBean.aluno.telRadio}" />
						</p:column>
					</p:row>

					<p:row>
						<p:column>
							<p:outputLabel for="grau-instrucao" value="Grau de Instrução: " />
						</p:column>
						<p:column>
							<p:selectOneMenu id="grau-instrucao"
								value="#{alunoBean.aluno.grauInstrucao}">
								<f:selectItem itemLabel="Selecione" itemValue="" />
								<f:selectItem itemLabel="Ensino Fundamental Incompleto"
									itemValue="fundamental-incompleto" />
								<f:selectItem itemLabel="Ensino Fundamental Completo"
									itemValue="fundamental-completo" />
								<f:selectItem itemLabel="Ensino Médio Incompleto"
									itemValue="medio-incompleto" />
								<f:selectItem itemLabel="Ensino Médio Completo"
									itemValue="medio-completo" />
								<f:selectItem itemLabel="Ensino Superior Incompleto"
									itemValue="superior-incompleto" />
								<f:selectItem itemLabel="Ensino Superior Completo"
									itemValue="superior-completo" />
								<f:selectItem itemLabel="Mestrado" itemValue="mestrado" />
								<f:selectItem itemLabel="Pós Graduação" itemValue="pos" />
								<f:selectItem itemLabel="Curso Técnico" itemValue="tecnico" />
							</p:selectOneMenu>
						</p:column>
						<p:column>
							<p:outputLabel for="profissao" value="Profissão: " />
						</p:column>
						<p:column colspan="3">
							<p:inputText id="profissao" size="40"
								value="#{alunoBean.aluno.profissao}" />
						</p:column>
					</p:row>
					<p:row>
						<p:column colspan="6" styleClass="ui-widget-header">
							<p:spacer height="0" />
						</p:column>
					</p:row>
					<p:row>
						<p:column>
							<p:outputLabel for="igreja-congrega"
								value="Igreja que congrega: " />
						</p:column>
						<p:column colspan="2">
							<p:inputText id="igreja-congrega" size="30"
								value="#{alunoBean.aluno.igrejaCongrega}" />
						</p:column>
						<p:column>
							<p:outputLabel for="igreja-presidente"
								value="Nome do Pastor Presidente: " />
						</p:column>
						<p:column colspan="2">
							<p:inputText id="igreja-presidente" size="30"
								value="#{alunoBean.aluno.pastorPresidente}" />
						</p:column>
					</p:row>
					<p:row>
						<p:column>
							<p:outputLabel for="igreja-endereco" value="Endereço:" />
						</p:column>
						<p:column colspan="5">
							<p:inputText id="igreja-endereco" size="78"
								value="#{alunoBean.aluno.igrejaEndereco}" />
						</p:column>
					</p:row>
					<p:row>
						<p:column>
							<p:outputLabel for="igreja-cargo"
								value="Cargo ou Função na Igreja: " />
						</p:column>
						<p:column colspan="2">
							<p:inputText id="igreja-cargo" size="30"
								value="#{alunoBean.aluno.igrejaCargo}" />
						</p:column>
						<p:column>
							<p:outputLabel for="curso-pretendido" value="Curso Pretendido: " />
						</p:column>
						<p:column colspan="2">
							<p:inputText id="curso-pretendido" size="30"
								value="#{alunoBean.aluno.cursoPretendido}" />
						</p:column>
					</p:row>
					<p:row>
						<p:column colspan="7">
							<div align="center" id="divModulos">
								<p:panel header="Modulos">

									<h:form id="formAdicionarModulo">
										<div align="right">
											<p:commandButton id="btn-adicionar"
												action="#{alunoBean.novoModulo()}" value="Adicionar"
												icon="ui-icon-plus" onclick="formModulo.reset()"
												oncomplete="dialogAdicionarModulo.show()" />
										</div>
									</h:form>
									<h:form id="formModuloResultado">
										<p:dataTable id="tabelaModulos"
											value="#{alunoBean.listaModulos}" var="modulo">
											<p:column headerText="Modulo">
												<h:outputText value="#{modulo.modulo}" />
											</p:column>

											<p:column headerText="Media" width="10%">
												<div align="center">
													<h:outputText value="#{modulo.media}" />
												</div>
											</p:column>

											<p:column headerText="Recebido" width="10%">
												<div align="center">
													<p:selectBooleanCheckbox />
													<!-- value="#{modulo.recebido}" -->
												</div>
											</p:column>

											<p:column headerText="Pago" width="10%">
												<div align="center">
													<p:selectBooleanCheckbox />
													<!-- value="#{modulo.pago}" -->
												</div>
											</p:column>

											<p:column headerText="Editar" width="10%">
												<div align="center">
													<p:commandButton id="btn-editar" icon="ui-icon-pencil"
														action="#{alunoBean.editarModulo()}" />
												</div>
											</p:column>

											<p:column headerText="Excluir" width="10%">
												<div align="center">
													<p:commandButton id="btn-excluir" icon="ui-icon-trash"
														action="#{alunoBean.removerModulo()}" />
												</div>
											</p:column>
										</p:dataTable>
									</h:form>
								</p:panel>
							</div>
						</p:column>
					</p:row>

					<p:row>
						<!-- campo de observações -->
						<p:column colspan="7" style="padding-left: 15px;">
							<h:outputLabel for="observacoes" value="Observações: " />
							<br />
							<p:inputTextarea id="observacoes" rows="5" cols="150"
								value="#{alunoBean.aluno.observacao}" />
						</p:column>
					</p:row>

					<p:row><!-- upload dos arquivos de observações -->
						<p:column colspan="7" style="padding-left: 15px;">
					
							<h:form id="formUploadObs" enctype="multipart/form-data">
								<h:outputLabel for="legenda-obs" value="Nome para o arquivo : " /><br />
					    		<p:inputText id="legenda-obs" size="60" value="#{alunoBean.arquivoObsNome}"/>
					    		<p:fileUpload mode="simple" id="upload-obs" style="padding: 0 75px 10px 75px;" 
					    			value="#{alunoBean.uploadFileObs}"/>
					    		<p:commandButton value="Anexar Arquivo" ajax="false" actionListener="#{alunoBean.handleFileUploadObs}" update="@([id$=tableArqObs])"/>

							</h:form>
							
							<h:form id="dialogId" prependId="false" enctype="multipart/form-data">
								<p:dataGrid id="tableArqObs" var="arquivo" value="#{alunoBean.arquivosObs}" rendered="#{not empty alunoBean.arquivosObs}"
									columns="1" rows="5" paginatorAlwaysVisible="false" paginator="true"
									effect="true"
									paginatorTemplate="{CurrentPageReport}  {FirstPageLink} {PreviousPageLink} {PageLinks} {NextPageLink} {LastPageLink} {RowsPerPageDropdown}"
									rowsPerPageTemplate="5, 10, 20, 30, 60">
									
									<p:column>
										<h:outputLabel value="#{arquivo.nome}" />
										<p:commandButton icon="ui-icon-trash" actionListener="#{alunoBean.removerArquivoObs}" update="tableArqObs" ajax="false" value="Excluir">
												<f:param name="arquivo" value="#{arquivo}" />
										</p:commandButton>
									</p:column>
								</p:dataGrid>
							</h:form>
						</p:column>
					</p:row>

				    <p:row> <!-- campo de informações -->
				    	<p:column colspan="7" style="padding-left: 15px;">
				    		<h:outputLabel for="informacoes" value="Campo de Informações: " /> <br />
							<p:inputTextarea id="informacoes" rows="5" cols="150" value="#{alunoBean.aluno.informacao}" />
				    	</p:column>
				    </p:row>
				    
				    <p:row> <!-- upload do campo de informações -->
			    	<p:column colspan="7" style="padding-left: 15px;">
			    		
			    		<h:outputLabel for="legenda-inf" value="Nome para o arquivo : " /><br />
			    		<p:inputText id="legenda-inf" size="60"/>
			    		<p:fileUpload mode="simple" id="upload-inf" style="padding: 0 75px 10px 75px;"/>
			    		<p:commandButton value="Anexar Arquivo" id="btn-upload-inf" />
			    		
			    		<p:separator id="separator-inf"/>	<!-- mock: adicionar a cada arquivo anexado -->
			    		<div style="padding: 5px 40px 30px 40px;"> 
			    			<div style="float: left">
					    		<p:outputLabel id="nome-arquivo-inf" value="Sem nome" style="color: darkgray"/>
			    			</div>
			    			<div align="right">
					    		<p:commandButton id="btn-visualizar-inf" value="Visualizar"/>
					    		<h:outputLabel style="padding-left: 40px;"/>
					    		<p:commandButton id="btn-excluir-arquivo-inf" icon="ui-icon-trash"/>
			    			</div>
			    		</div>
			    		
			    	</p:column>
			    </p:row>
				    
			   	</p:panelGrid>
			   	
				<f:facet name="footer">  
					<h:outputLabel style="padding-left: 600px;"/>
					<p:commandButton id="btn-cancelar" action="#{alunoBean.cancelarCadastro()}" value="Cancelar" icon="ui-icon-closethick" style="margin:0"/>
					<h:outputLabel style="padding-left: 100px;"/>
					<p:commandButton id="btn-reset" type="reset" value="Limpar" icon="ui-icon-minusthick" style="margin:0"/>
					<h:outputLabel style="padding-left: 100px;"/>
			        <p:commandButton id="btn-salvar" action="#{alunoBean.salvarAluno()}" value="#{alunoBean.tipoBotaoCadastro}" icon="ui-icon-disk" style="margin:0" />
			    </f:facet>
			   	
			</p:panel>
		</h:form>
	</div>	

<!-- 	ADICIONAR MODULO -->
<p:dialog header="Adicionar Módulo" widgetVar="dialogAdicionarModulo" modal="true" 
	draggable="false" resizable="false" width="660">
	<div align="center">
		<h:form id="formModulo">
			<p:panelGrid>
				<p:row>
					<p:column><h:outputLabel for="nome-modulo" value="Módulo: " /></p:column>
					<p:column colspan="3"><p:inputText id="nome-modulo" size="60" value="#{alunoBean.modulo.modulo}" /></p:column>
				</p:row>
				<p:row>
					<p:column><h:outputLabel for="media-modulo" value="Media: " /></p:column>
					<p:column><p:inputText id="media-modulo" size="30" value="#{alunoBean.modulo.media}"/></p:column>
					<p:column>
						
					</p:column>
				</p:row>
				<p:row>
					<p:column colspan="4">
						<div align="right">
							<p:commandButton value="Cancelar" style="width: 120px;"  onclick="dialogAdicionarModulo.hide()"/>
							<p:commandButton value="Adicionar" style="width: 120px;" action="#{alunoBean.adicionarModulo}" oncomplete="dialogAdicionarModulo.hide()" update="@([id$=tabelaModulos])"/>
						</div>
					</p:column>
				</p:row>
			</p:panelGrid>
		</h:form>
	</div>
</p:dialog>

<!-- ADICIONAR FOTO PRINCIPAL -->
<p:dialog widgetVar="dialogUploadFoto" modal="true" header="Upload Foto"
		width="670" showEffect="fade" hideEffect="fade" resizable="false" id="uploadFotoDialog">
	<h:form id="formFoto" prependId="false" enctype="multipart/form-data">
	
		<p:fileUpload value="#{alunoBean.fotoPrincipal}" mode="simple" />
		
		<p:commandButton value="Anexar" ajax="false" actionListener="#{alunoBean.handleFileUploadFotoPrincipal}" update="@([id$=foto])"/>
	</h:form>
	
</p:dialog>
	
</h:body>
</html>